<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
</head>
<link rel="stylesheet"
	href="css/gopayment.css?id=<%=new Date().getTime()%>" />
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
	var hdzid = "";
	var dzid = "";
	var isBack = false;

	function addressdan(dzids) {
		var dzids = "";
		$("#address002").empty();
		var hid = "${user.hid}";
		var pd = "-1";
		var address = "";
		var sss = "${address.dzid}";
		if (sss != "") {
			dzids = sss;
		}
		//dzid = dzids;
		$
				.post(
						"gopaymenttwo.shtml",
						{
							"hid" : hid,
							"pd" : pd,
							"dzid" : dzid,
							"dzids" : dzids
						},
						function(data) {
							address = data.address1 + data.address2
									+ data.address3 + data.xiangxi;
							var one = "<div><span style='color:#999;' data="+data.dzid+" class='shr'>收货人：</span><span>"
									+ data.shname
									+ "</span></div><div><span style='color:#999;'>联系方式：</span><span>"
									+ data.phone
									+ "</span></div><div><span style='color:#999;'>收货地址：</span><span>"
									+ address + "</span></div>";
							$("#address002").append(one);
							isBack = true;
						})
	}

	function addressAll() {
		$("#addressTab002").empty();
		var hid = "${user.hid}";
		var pd = "0";
		var dzid = "";
		var address = "";
		$
				.post(
						"gopaymenttwo.shtml",
						{
							"hid" : hid,
							"pd" : pd,
							"dzid" : dzid
						},
						function(data) {
							$
									.each(
											data,
											function() {
												address = this.address1
														+ this.address2
														+ this.address3
														+ this.xiangxi;
												var two = "<div style='height:100px;border:1px solid #e8e8e8;padding:20px;box-sizing:border-box;margin-bottom:10px;margin-right:10px;transition:all 0.18s linear;' data="+this.dzid+" class='address005s'><div><span style='color:#999;'>收货人：</span><span>"
														+ this.shname
														+ "</span></div><div><span style='color:#999;'>联系方式：</span><span>"
														+ this.phone
														+ "</span></div><div><span style='color:#999;'>收货地址：</span><span>"
														+ address
														+ "</span></div></div>";
												$("#addressTab002").append(two);
											})
						})
	}
	function addaddressAll() {

		if ($("#province").val() == "") {
			alert("请选择省份");
			return;
		}
		if ($("#detailsaddress").val() == "") {
			alert("请填写详细的收货地址");
			return;
		}
		if ($("#people").val() == "") {
			alert("请填写收货人");
			return;
		}
		if ($("#phone").val() == "") {
			alert("请填写手机号");
			return;
		}
		$("#addressTab002").empty();
		var hid = "${user.hid}";
		var pd = "0";
		var dzid = "";
		var address = "";
		var address1 = $("#province").val();
		var address2 = $("#city").val();
		var address3 = $("#area").val();
		var detailsaddress = $("#detailsaddress").val();
		var phone = $("#phone").val();
		var people = $("#people").val();
		$
				.post(
						"gopaymenttwo.shtml",
						{
							"hid" : hid,
							"pd" : pd,
							"dzid" : dzid,
							"address1" : address1,
							"address2" : address2,
							"address3" : address3,
							"detailsaddress" : detailsaddress,
							"phone" : phone,
							"people" : people
						},
						function(data) {
							$
									.each(
											data,
											function() {
												address = this.address1
														+ this.address2
														+ this.address3
														+ this.xiangxi;
												var two = "<div style='height:100px;border:1px solid #e8e8e8;padding:20px;box-sizing:border-box;margin-bottom:10px;margin-right:10px;transition:all 0.18s linear;' data="+this.dzid+" class='address005s'><div><span style='color:#999;'>收货人：</span><span>"
														+ this.shname
														+ "</span></div><div><span style='color:#999;'>联系方式：</span><span>"
														+ this.phone
														+ "</span></div><div><span style='color:#999;'>收货地址：</span><span>"
														+ address
														+ "</span></div></div>";
												$("#addressTab002").append(two);
											})
						})

		$("#address007").css("display", "block");
		$("#address008").css("display", "none");
	}
	$(function() {
		
		new PCAS("province", "city", "area", "---请选择---", "---请选择---",
				"---请选择---");
		new PCAS("provinces", "citys", "areas", "---请选择---", "---请选择---",
				"---请选择---");
		addressdan();
		var timer = setInterval(function() {
			if (isBack == true) {
				hdzid = $(".shr").attr("data");
				$("#orderdzid").val(hdzid);
			}
		}, 100);
		var s = "${address.dzid}";
		if (s != "") {
			$("#address007").css("display", "none");
			$("#address0010").css("display", "block");
			new PCAS("provinces", "citys", "areas", "${address.address1}",
					"${address.address2}", "${address.address3}");
			/* $("#citys").val("${address.address2}")
			$("#provinces").val("${address.address1}")
			alert("${address.address2}");
			$("#areas").val("${address.address3}") */
		}

		/* addressAll(); */
		$("#addressTab").click(function() {
			$(".addressTab001").fadeIn(500);
			setTimeout(function() {
				$("#address003").show(300);
				addressAll();
			}, 299);
		})

		$("#addressExit").click(function() {
			$("#address003").fadeOut(500);
			setTimeout(function() {
				$(".addressTab001").slideUp(300);
			}, 299);
		})
		$("#addressTab002").on("click", ".address005s", function() {
			dzid = $(this).attr("data");
			$(this).css({
				"box-shadow" : "2px 2px 10px rgba(0,0,0,0.6)",
				"border" : "1px solid #b4a078"
			});
			$(this).siblings().css({
				"border" : "1px solid #e8e8e8",
				"box-shadow" : "none"
			});
		});

		$("#addressDetermine").click(function() {
			if (dzid == undefined) {
				alert("请选择地址");
				return;
			}
			$(".addressTab001").slideUp(300);
			addressdan(dzid);
			var timer = setInterval(function() {
				if (isBack == true) {
					hdzid = $(".shr").attr("data");
					clearInterval(timer);
					$("#dzids").val(hdzid);
				}
			}, 100);
		})

		$("#create-address").click(
				function() {
					$("#address007").css("display", "none");
					$("#address008").css("display", "block");
					$("#province").val("---请选择---");
					$("#city").val("---请选择---");
					$("#area").val("---请选择---");
					new PCAS("province", "city", "area", "---请选择---",
							"---请选择---", "---请选择---");
					$("#detailsaddress").val("");
					$("#people").val("");
					$("#phone").val("");
					$("#addressTab002").val("");
				})
		$("#quxiao").click(function() {
			$("#address007").css("display", "block");
			$("#address008").css("display", "none");
		})
		$("#saveAddress").click(function() {
			addaddressAll();
		})
		//$("#dzidssss").val(hdzid);
		$("#upd").click(function() {
			/* new PCAS("provinces", "citys", "areas", "---请选择---", "---请选择---",
			"---请选择---"); */
			/* $("#address007").css("display", "none");
			$("#address0010").css("display","block"); */
			/* location.href = "updSCAddress.shtml?dzid=" + hdzid; */
				$("#updform").attr("action","updSCAddress.shtml");
				$("#updform").trigger("submit");
		})
		$("#quxiaos").click(function() {
			$("#address007").css("display", "block");
			$("#address0010").css("display", "none");
		})
		$("#saveAddresss").click(function() {
			$("#updform").attr("action","updaddress.shtml");
			$("#updform").trigger("submit");
		})
		
		/* Parameter("orderid");
		String dzid = request.getParameter("orderdzid");
		String hid = request.getParameter("orderhid");
		String paymethod = request.getParameter("paymethod");
		String totprice = request.getParameter("totprice"); */
		
		
		var s = "${kai}";
		if (s != "") {
			$("#address007").css("display", "block");
			$("#address0010").css("display", "none");
		}
		 var cartidss = new Array();
		 var i = 0;
				 $(".cartidss").each(function(){
						cartidss[i] = $(this).val();
						i++;
					})
					 var cartimage = new Array();
		 var j = 0;
				 $(".cartimage").each(function(){
					 cartimage[j] = $(this).val();
						j++;
					})
		$(".gozhifu").click(function(){
			var orderid = $("#orderid").val();
			var orderdzid = $("#orderdzid").val();
			var orderhid = $("#orderhid").val();
			var paymethod = $("#paymethod").val();
			var totprice = $("#totprices").val();
			$.post("doOrder.shtml",{"cartidss":cartidss,"orderid":orderid,"orderdzid":orderdzid,"orderhid":orderhid,"paymethod":paymethod,"totprice":totprice,"cartimage":cartimage})
			
			var shifou = confirm("是否去结账","");
			if(shifou){
				location.href="doOrder002.shtml?orderid="+orderid;
			}
			
		})
		$(".payline:last").remove();
		
		//var rand = parseInt((Math.random()*1000)+9999);
		var rand = parseInt((Math.random()*1000)+9999);
		var mydate = new Date();
		var year=mydate.getFullYear();
		var month = mydate.getMonth()+1;
		if(month < 10){
			month = "0"+month;
			}
		var date = mydate.getDate();
		var orderid = +year+""+month+""+date+""+rand;
		$("#orderNO").html(orderid);
		$("#orderid").val(orderid);
		$("#gopaying").click(function(){
			$("#updform").attr("action","doOrder002.shtml");
			$("#updform").trigger("submit");
		})
		$(".paymethods").click(function(){
			$("#paymethod").val($(this).val());
		})
	})
</script>
<body>
	<%@ include file="Header.jsp"%>
	<form action="updSCAddress.shtml" id="updform" method="post">
	<div class="pay-style-width">
		<div class="pay-style-width-ern">
			<div style="margin-top: 40px;">
				<div
					style="height: 35px; background-color: #f5f5f5; border: 1px solid #e8e8e8; line-height: 35px; color: #999; padding-left: 20px; box-sizing: border-box;">收货信息</div>
				<div id="addressTab00222">
					<!-- 显示地址信息 -->
					
					<div class="clear address01"
						style="box-sizing: border-box; padding: 20px; border: 1px solid #e8e8e8"
						id="address007">
						<div class="addressInfo001 left">
							<div
								style="width: 65px; height: 30px; line-height: 30px; text-align: center; background-color: #f5f3ef; border: 1px solid #b4a078; border-radius: 2px; color: #b4a078"
								id="upd">修改</div>
							<div id="address002"></div>
						</div>
						<div class="right">
							<div
								style="height: 100px; border-left: 1px solid #e2e2e2; float: left; margin-right: 80px; margin-top: 15px;"></div>
							<div class="left" style="margin-top: 35px;">
								<div style="margin-left: 25px;" id="addressTab">地址切换</div>
								<div
									style="width: 100px; margin-top: 15px;; height: 28px; line-height: 28px; text-align: center; background-color: #f5f5f5; border: 1px solid #ccc; border-radius: 2px; color: blank; margin-right: 50px;"
									id="create-address">新建地址</div>
							</div>
						</div>
					</div>
			<!-- 		<input type="text" name="dzidssss" id="dzidssss" /> -->
					<!-- 显示新建地址 -->
					<script language="javascript" src="js/PCASClass.js"
						charset="gb2312"></script>
					<div class="clear address01"
						style="box-sizing: border-box; padding: 25px; border: 1px solid #e8e8e8; display: none;"
						id="address008">
						
							<div class="left">
								<div class="clear" style="margin-bottom: 25px;">
									<div class="left">所在地区：</div>
									<div class="left">
										<select name="province" id="province"
											style="margin-right: 20px; width: 130px; height: 22px; letter-spacing: 0.2em;"></select><select
											name="city" id="city"
											style="margin-right: 20px; width: 130px; height: 22px; letter-spacing: 0.2em;"></select><select
											name="area" id="area"
											style="margin-right: 20px; width: 130px; height: 22px; letter-spacing: 0.2em;"></select>
									</div>

								</div>
								<div class="clear" style="margin-bottom: 25px;">
									<div class="left">详细地址：</div>
									<div class="left">
										<textarea name="detailsaddress" id="detailsaddress" cols="86"
											rows="3"></textarea>
									</div>
								</div>
								<div style="margin-left: 12px;">
									<div class="left">
										<span>收货人：</span><span><input type="text" name="people"
											id="people" style="width: 160px; height: 22px;" /></span>
									</div>
									<div class="left" style="margin-left: 40px;">
										<span>手机号码：</span><span><input type="text" name="phone"
											id="phone" style="width: 160px; height: 22px;" /></span>
									</div>
								</div>
							</div>
							<div
								style="border-left: 1px dashed #dedede; margin-left: 80px; float: left; margin-top: 0px; height: 160px;">
							</div>
							<div style="float: left">
								<p
									style="width: 120px; margin-left: 90px; margin-top: 20px;; margin-bottom: 25px; height: 32px; line-height: 32px; background-color: #b4a078; border: 1px solid #b4a078; border-radius: 2px; color: white; font-size: 14px; letter-spacing: 0.2em; text-align: center;"
									id="saveAddress">保存地址</p>
								<p
									style="width: 120px; margin-left: 90px; height: 32px; text-align: center; line-height: 32px; background-color: #f5f3ef; border: 1px solid #b4a078; border-radius: 2px; color: white; font-size: 14px; letter-spacing: 0.2em; color: #b4a078"
									id="quxiao">取消</p>
							</div>
				
					</div>

					<!-- 修改的地址模板 -->
					
					<div class="clear address01"
						style="box-sizing: border-box; padding: 25px; border: 1px solid #e8e8e8; display: none;"
						id="address0010">
							
							<div class="left">
								<div class="clear" style="margin-bottom: 25px;">
									<div class="left">所在地区：</div>
									<div class="left">
										<select name="provinces" id="provinces"
											style="margin-right: 20px; width: 130px; height: 22px; letter-spacing: 0.2em;"></select><select
											name="citys" id="citys"
											style="margin-right: 20px; width: 130px; height: 22px; letter-spacing: 0.2em;"></select><select
											name="areas" id="areas"
											style="margin-right: 20px; width: 130px; height: 22px; letter-spacing: 0.2em;"></select>
									</div>
								</div>
								<div class="clear" style="margin-bottom: 25px;">
									<div class="left">详细地址：</div>
									<div class="left">
										<textarea name="detailsaddresss" id="detailsaddresss"
											cols="86" rows="3">${address.xiangxi }</textarea>
									</div>
								</div>
								<div style="margin-left: 12px;">
									<div class="left">
										<span>收货人：</span><span><input type="text"
											name="peoples" id="peoples"
											style="width: 160px; height: 22px;"
											value="${address.shname }" /></span>
									</div>
									<div class="left" style="margin-left: 40px;">
										<span>手机号码：</span><span><input type="text"
											name="phones" id="phones" style="width: 160px; height: 22px;"
											value="${address.phone }" /> <input type="hidden"
											name="dzid" id="dzid" value="${address.dzid }" /> <input
											type="hidden" name="Hid" id="Hid" value="${user.hid }" /> 
											
											</span>
									</div>
								</div>
							</div>
							<div
								style="border-left: 1px dashed #dedede; margin-left: 80px; float: left; margin-top: 0px; height: 160px;">
							</div>
							<div style="float: left">
								<p
									style="width: 120px; margin-left: 90px; margin-top: 20px;; margin-bottom: 25px; height: 32px; line-height: 32px; background-color: #b4a078; border: 1px solid #b4a078; border-radius: 2px; color: white; font-size: 14px; letter-spacing: 0.2em; text-align: center;"
									id="saveAddresss">保存地址</p>
								<p
									style="width: 120px; margin-left: 90px; height: 32px; text-align: center; line-height: 32px; background-color: #f5f3ef; border: 1px solid #b4a078; border-radius: 2px; color: white; font-size: 14px; letter-spacing: 0.2em; color: #b4a078"
									id="quxiaos">取消</p>
							</div>
					
						<!-- 			<script language="javascript" defer>
					new PCAS("province","city","area","吉林省","白城市","大安市");
					</script> -->
					</div>
				</div>

				<div class="addressTab001">
					<div
						style="width: 470px; background-color: white; height: 460px; margin: 120px auto; padding: 20px 40px 30px 40px; box-sizing: border-box; display: none"
						id="address003">
						<div style="height: 40px; line-height: 30px;" class="clear">
							<p class="left" style="font-size: 14px;">选择地址</p>
							<p class="right">*</p>
						</div>

						<div id="addressTab002"
							style="height: 320px; max-height: 320px; letter-spacing: 0.4em; overflow: auto;">
						</div>
						<div
							style="margin-top: 20px; text-align: center; letter-spacing: 0.8em;"
							class="clear">
							<div
								style="width: 110px; height: 30px; line-height: 30px; border: 1px solid #ccc; background-color: #ccc; border-radius: 2px; float: left; margin-left: 80px; color: white; font-size: 14px;"
								id="addressDetermine">确定</div>
							<div
								style="width: 110px; height: 30px; line-height: 30px; border: 1px solid #ccc; background-color: #f5f5f5; border-radius: 2px; float: left; margin-left: 20px; font-size: 14px;"
								id="addressExit">取消</div>
						</div>
					</div>
				</div>
			</div>
			<div style="margin-top: 30px;">
				<div
					style="height: 35px; background-color: #f5f5f5; border: 1px solid #e8e8e8; line-height: 35px; color: #999; padding-left: 20px; box-sizing: border-box;"
					class="clear shopInfo001">
					<p style="width: 280px; border-right: 1px solid #e8e8e8;">商品信息</p>
					<p
						style="width: 150px; border-right: 1px solid #e8e8e8; text-align: center;">单价</p>
					<p
						style="width: 150px; border-right: 1px solid #e8e8e8; text-align: center;">数量</p>
					<p
						style="width: 150px; border-right: 1px solid #e5e5e5; text-align: center;">小计</p>
					<p style="width: 150px; text-align: center;">实付</p>
				</div>
				
				<div
					style="padding: 20px; box-sizing: border-box; border: 1px solid #e8e8e8"
					class="clear">
				<!-- 	<form action="doOrder.shtml" method="post" id="doOrderform"> -->
					<c:forEach items="${Listsbycart_id }" var="cart">
					<div class="clear shopInfo001">
						<div style="width: 280px;" class="clear">
						<input type="hidden" name="cartidss" class="cartidss" value="${cart.cartid }" />
							<p class="left"
								style="width: 90px; text-align: center; border: 1px dashed #e8e8e8; margin-right: 18px;">
								<img src="${cart.cartimg }" width="70px;" />
								<input type="hidden" class="cartimage" value="${cart.cartimg }" />
							</p>
							<ul class="left clear" style="margin-top: 18px;">
								<li>${cart.cartname}</li>
								<li style="margin-top: 8px;">${cart.cart_typeg}</li>
							</ul>
						</div>
						<div style="width: 150px; text-align: center; margin-top: 30px;">
							<span>￥</span><span>${cart.cartprice }</span>
						</div>
						<div style="width: 150px; text-align: center; margin-top: 30px;">${cart.cartnum }</div>
						<div style="width: 150px; text-align: center; margin-top: 30px;">
							<span>￥</span><span>${cart.carttotal }</span>
						</div>
						<div style="width: 150px; text-align: center; margin-top: 30px;">
							<span>￥</span><span>${cart.carttotal }</span>
						</div>
					</div>
					<div style="margin-top: 20px; border-bottom: 1px dashed #d2d1d1;margin-bottom:20px;" class="payline">
					</div>
					</c:forEach>
					<input type="hidden" name="orderid" id="orderid" />
					<input type="hidden" name="orderdzid" id="orderdzid" />
					<input type="hidden" name="orderhid" id="orderhid" value="${user.hid}" />
				<!-- 	</form> -->
				</div>
			</div>
			<div>
				<div style="margin-top: 15px;" id="nonzaizhe">
				</div>
				<div
					style="width: 100px; float: right; margin-bottom: 2px; color: white; height: 35px; line-height: 35px; text-align: center; background-color: #c0ae8a; border: 1px solid #ccc; border-radius: 2px; color: blank; margin-right: 50px;"
					class="gozhifu">下单</div>
				<div style="clear: both;"></div>
				<%-- <div id="gopay" style="display: none;">
					<div
						style="height: 35px; background-color: #f5f5f5; border: 1px solid #e8e8e8; line-height: 35px; color: #999; padding-left: 20px; box-sizing: border-box; margin-top: 10px;">
						<span>交易号：</span><span id="orderNO">654545456151654153151</span>
					</div>
					<div
						style="padding: 20px 0px 20px 20px; box-sizing: border-box; border: 1px solid #e8e8e8">
						<div class="clear">
							<div
								style="width: 180px; text-align: center; float: left; margin-left: 15px; margin-bottom: 15px;"
								class="clear">
								<p class="left" style="margin-top: 15px; margin-right: 15px;">
									<input type="radio" name="paymethods" class="paymethods" value="支付宝支付" />
								</p>
								<p class="left">
									<img src="images/paymethod/paymethod_01.png" width="120px" />
								</p>
							</div>
							<div style="width: 180px; text-align: center; float: left"
								class="clear">
								<p class="left" style="margin-top: 15px; margin-right: 15px;">
									<input type="radio" name="paymethods" class="paymethods" value="信用卡支付" />
								</p>
								<p class="left">
									<img src="images/paymethod/paymethod_04.png" width="120px" />
								</p>
							</div>
							<div style="width: 180px; text-align: center; float: left"
								class="clear">
								<p class="left" style="margin-top: 15px; margin-right: 15px;">
									<input type="radio" name="paymethods" class="paymethods" value="肚里支付" />
								</p>
								<p class="left">
									<img src="images/paymethod/paymethod_06.png" width="120px" />
								</p>
							</div>
							<div style="width: 180px; text-align: center; float: left"
								class="clear">
								<p class="left" style="margin-top: 15px; margin-right: 15px;">
									<input type="radio" name="paymethods" class="paymethods" value="网易支付"  />
								</p>
								<p class="left">
									<img src="images/paymethod/paymethod_09.png" width="120px" />
								</p>
							</div>
							<div style="width: 190px; text-align: center; float: left"
								class="clear">
								<p class="left" style="margin-top: 15px; margin-right: 15px;">
									<input type="radio" name="paymethods" class="paymethods" value="微信支付" />
								</p>
								<p class="left">
									<img src="images/paymethod/paymethod_12.png" width="120px" />
								</p>
							</div>
							<input type="hidden" name="paymethod" id="paymethod" />
						</div>
						<div class="clear">
							<div
								style="width: 100px; float: right; margin-bottom: 20px; margin-left: 20px; color: white; height: 35px; line-height: 35px; text-align: center; background-color: #c0ae8a; border: 1px solid #ccc; border-radius: 2px; color: blank; margin-right: 50px;"
								id="gopaying">立即支付</div>
							<div style="float: right; margin-top: 15px;">
								<span>总金额</span> <span>￥</span> <span
									style="color: red; font-size: 16px;">${totprice }</span>
									
							</div>
						</div>
					</div>
				</div> --%>
				<input type="hidden" name="totprice" id="totprices" value="${totprice }" />
			</div>
		</div>
	</div>
	</form>


</body>
</html>